<template>
  <div>
    <div class="printOrder">
      <!-- <el-row>
        <el-col :span="24">
          <label class="durg_title">申领详情</label>
        </el-col>
      </el-row> -->
      <el-page-header @back="goBack" :content="detail.title"> </el-page-header>
      <br />

      <el-row>
        <el-row>
          <el-col :span="8">领用科室：{{ detail.departmentName }}</el-col>
          <el-col :span="8">领用医生：{{ detail.doctorName }}</el-col>
          <el-col :span="8">经手人：{{ detail.operatorName }}</el-col>
        </el-row>
        <br />
        <el-row>
          <el-col :span="8">申领日期：{{ detail.applyDate }}</el-col>
          <el-col v-if="detail.status == 1" :span="8"
            >出库日期：{{ detail.outStockDate }}</el-col
          >
          <el-col v-if="detail.status == 2" :span="8">拒绝原因：{{ detail.denialReason?detail.denialReason:'无'}}</el-col>
        </el-row>
        <br />
        <el-col :span="24">
          <el-table :data="detail.list">
            <el-table-column
              prop="id"
              label="序号"
              width="100"
              :key="Math.random()"
            />
            <el-table-column prop="drugName" label="药品名称" :key="Math.random()" />
           <el-table-columnv-if="detail.status!=1"  prop="spec" label="规格" :key="Math.random()" />
            <el-table-column prop="factory" :key="Math.random()" label="生产厂家" />
            <el-table-column prop="supplierName" :key="Math.random()" label="供应商" />
            <el-table-column prop="applyNum" :key="Math.random()" label="领用数量" />
            <el-table-column label="单位" :key="Math.random()" >
              <template slot-scope="scope">
                {{ scope.row.applyUnit | changeAssist(dwList) }}
              </template>
            </el-table-column>
            <el-table-column
              prop="sellMoney"
              label="零售价"
              :key="Math.random()"
            />
            <el-table-column
              prop="costMoney"
              label="成本价"
              :key="Math.random()"
            />
            <el-table-column label="库存数量" prop="totalQuantity" :key="Math.random()">
              <template slot-scope="sco">
                {{sco.row | calculateStockNum(dwList)}}
                <!-- {{ sco.row.totalQuantity }}
                {{ sco.row.totalQuantityUnit | changeAssist(dwList) }} -->
              </template>
            </el-table-column>
            <el-table-column
              v-if="detail.status == 1"
              prop="lotNumber"
              label="批次"
              :key="Math.random()"
            />
            <el-table-column
              v-if="detail.status == 1"
              label="有效期"
              :key="Math.random()"
            >
              <template slot-scope="scope">
                {{ scope.row.effectiveTime | changeTime }}
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
    </div>
    <br />
    <span slot="footer">
      <el-button v-if="detail.status == 0" type="primary" @click="onExamine"
        >确认出库</el-button
      >
      <el-button v-if="detail.status == 0" type="primary" @click="onReject"
        >拒绝出库</el-button
      >
      <el-button v-if="detail.status == 1" type="primary" @click="onExcel">导出</el-button>
      <el-button v-if="detail.status == 1" type="primary" @click="onPrint">打印</el-button>
    </span>
    <iframe
      v-if="showOrder"
      frameborder="0"
      height="0px"
      width="0px"
      ref="putiframe"
      src="/print/putstorage.html"
    ></iframe>
  </div>
</template>
<script>
import Valid from "@/_js/validate.js";
import Excel from "@/_js/excel.js";
import enumArr from "../_enum";
export default {
  data() {
    return {
      btnLoading: false,
      detail: "",
      dwList: [],
      showOrder: false,
      durg_id: "",
      statusList: enumArr.status,
      iframeContent: {},
    };
  },
  mounted() {
    this.durg_id = this.jieMi(this.$route.query.id);
      this.getDetail();
      this.getBasicData();
  },
  methods: {
    getDetail() {
      this.$api.getOutboundAuditList({ outPutId: this.durg_id }).then((res) => {
        if (res.executed) {
          this.detail = res.dataBody;
          this.detail.title=this.detail.status==1?'出库审核详情-已出库':'出库审核详情';
        }
      });
    },
    onClose() {
      let th = this;
      let type = th.$route.query.type;
      this.addNavMenu("药品库", "/page/drugIndex");
      this.$router.push({
        path: "/page/drugIndex",
        query: this.getUrlToken({ id: this.jiaMi(1) }),
      });
    },
    //获取通用配置
    getBasicData() {
      this.getCommonConfigByKey("药品剂量单位").then((res) => {
        this.dwList = res;
      });
    },
    onExamine() {
      let th = this;
      th.$confirm(`确定审核通过吗?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true,
      }).then(() => {
        this.$api.confirmOutbound({ id: this.durg_id }).then((res) => {
          if (res.executed) {
            this.$message.success(res.message);
          } else {
            this.$message.error(res.message);
          }
          this.getDetail();
        });
      });
    },
    onReject() {
      this.$prompt("拒绝原因", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        // inputPattern: /\S/,
        // inputErrorMessage: "请输入拒绝原因",
        inputType: "textarea",
      }).then(({ value }) => {
        this.$api
          .rejectOutbound({ id: this.durg_id, reason: value })
          .then((res) => {
            if (res.executed) {
              this.$message.success(res.message);
            } else {
              this.$message.error(res.message);
            }
            this.getDetail();
          });
      });
    },
    //返回上一级
    goBack() {
      this.$router.go(-1);
    },
    //导出
    onExcel() {
      let list = this.detail.list;
      list.map((it) => {
        it.effectiveTime = it.effectiveTime.substring(0, 10);
        it.applyDate = this.detail.applyDate.substring(0, 10);
        it.doctorName = this.detail.doctorName;
        it.outStockDate = this.detail.outStockDate.substring(0, 10);
      });
      let dw =[];
      dw[0]='';
      this.dwList.map((it) => {
        dw[it.id] = it.desc;
      });
      Excel(
        list,
        [
          { key: "drugName", name: "药品名称" },
          { key: "spec", name: "规格" },
          { key: "factory", name: "生产厂家" },
          { key: "supplierName", name: "供应商" },
          { key: "sellMoney", name: "零售价" },
          { key: "costMoney", name: "成本价" },
          { key: "lotNumber", name: "批次" },
          { key: "applyDate", name: "申领日期" },
          { key: "effectiveTime", name: "有效期" },
          { key: "applyNum", name: "出库数量" },
          { key: "applyUnit", name: "单位", enum: dw, type: "enum" },
          { key: "doctorName", name: "出库人" },
          { key: "outStockDate", name: "出库时间" }
        ],
        "申领详情"
      );
    },
    //打印
    onPrint(){
      const th = this;
      th.showOrder = true;
      th.showLoading();
      setTimeout(function() {
        th.iframeContent = th.$refs.putiframe.contentWindow;
        th.iframeContent.postMessage(
          {
            cmd: "postJson",
            params: JSON.stringify({
              detail:th.detail,
              list: th.detail.list,
              hospitalName: th.adminUser.hospitalName,
              logo: th.adminUser.printLogo,
              dwList: th.dwList
            }),
          },
          "*"
        );
      }, 1000);
      setTimeout(function() {
        th.showLoading(false);
      }, 1000); 
    }
  },
  components: {},
};
</script>
<style lang="scss" scoped>
.durg_title {
  display: inline-block;
  width: 100%;
  font-size: 16px;
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px;
  margin-bottom: 10px;
}
.durg_form {
  .el-input,
  .el-select {
    width: 90%;
  }
  .el-form-item__label {
    padding-bottom: 0;
  }
  .one_dose_select {
    width: 30%;
    position: absolute;
    right: 28px;
  }
}
</style>
